<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<link rel="stylesheet" th:href="@{/static/infor/css/shouye.css}">
	<script src="http://www.jq22.com/jquery/jquery-1.10.2.js"></script>
	<script   th:src="@{/static/infor/js/modernizr-custom-v2.7.1.min.js}"></script>
	<script>
		$(document).ready(function(){
	var $miaobian=$('.Xcontent08>div');
	var $huantu=$('.Xcontent06>img');
	var $miaobian1=$('.Xcontent26>div');
	$miaobian.mousemove(function(){miaobian(this);});
	$miaobian1.click(function(){miaobian1(this);});
	function miaobian(thisMb){
		for(var i=0; i<$miaobian.length; i++){
			$miaobian[i].style.borderColor = '#dedede';
		}
		thisMb.style.borderColor = '#cd2426';

		$huantu[0].src = thisMb.children[0].src;
	}
	function miaobian1(thisMb1){
		for(var i=0; i<$miaobian1.length; i++){
			$miaobian1[i].style.borderColor = '#dedede';
		}
//		thisMb.style.borderColor = '#cd2426';
		$miaobian.css('border-color','#dedede');
		thisMb1.style.borderColor = '#cd2426';
		$huantu[0].src = thisMb1.children[0].src;
	}
			$(".Xcontent33").click(function(){
			var value=parseInt($('.input').val())+1;
       		$('.input').val(value);
		})

		$(".Xcontent32").click(function(){	
			var num = $(".input").val()
			if(num>0){
				$(".input").val(num-1);
			}			
			
		})

		})
	</script>
	

</head>

<body>
<div class="Xcontent">
		<ul class="Xcontent01">
				<div class="Xcontent06"><img th:src="@{/static/daqi/images/}+${good.pic}" height="475" width="450"></div>
				<ol class="Xcontent08">
					<div class="Xcontent07"><img th:src="@{/static/daqi/images/}+${good.pic}"></div>
					<div class="Xcontent07"><img th:src="@{/static/daqi/images/}+${good.pic}"></div>
					<div class="Xcontent07"><img th:src="@{/static/daqi/images/}+${good.pic}"></div>
					<div class="Xcontent07"><img th:src="@{/static/daqi/images/}+${good.pic}"></div>
					<div class="Xcontent07"><img th:src="@{/static/daqi/images/}+${good.pic}"></div>
					<div class="Xcontent07"><img th:src="@{/static/daqi/images/}+${good.pic}"></div>

				</ol>
				<ol class="Xcontent13">
					<div class="Xcontent14"><a href="#"><p th:text="${good.name}"></p></a></div>
					<div class="Xcontent15"><img th:src="@{/static/infor/images/shangpinxiangqing/X11.png}"></div>

					<div class="Xcontent17">
						<p class="Xcontent18">售价</p>
						<p class="Xcontent19">￥<span th:text="${good.price}"></span></p>
						<div class="Xcontent20">
<!--							先获得类别对象,在获得类别名-->
							<p class="Xcontent21">类别:</p>
							<p class="Xcontent22" th:text="${good.goodsCatory.cname}"></p>
						</div>
						<div class="Xcontent23">
<!--							先获得类别对象,在获得类别名-->
							<p class="Xcontent24">上架时间:</p>
<!--							日期格式化的写法-->
							<p class="Xcontent25" th:text="${#dates.format(good.createtime,'yyyy-MM-dd HH:mm:ss')}"></p>
						</div>
						<div class="Xcontent26">
							<p class="Xcontent27">服务</p>
							<p class="Xcontent28">30天无忧退货&nbsp;&nbsp;&nbsp;&nbsp;       48小时快速退款 &nbsp;&nbsp;&nbsp;&nbsp;        满88元免邮</p>
						</div>
						
					</div>

					<div class="Xcontent30">
						<p class="Xcontent31">数量</p>
						<div class="Xcontent32"><img th:src="@{/static/infor/images/shangpinxiangqing/X15.png}"></div>
						<form>	
                         <input class="input" value="1" id="num">
                       <input type="hidden"  th:value="${good.id}" id="gid">
						</form>
						<div class="Xcontent33"><img th:src="@{/static/infor/images/shangpinxiangqing/16.png}"></div>

					</div>
<!--					立即购买-->
					<div class="Xcontent34"><a href="#"><img th:src="@{/static/infor/images/shangpinxiangqing/X17.png}"></a></div>
<!--					加入购物车-->
					<div class="Xcontent35"><a href="javascript:cart();"><img th:src="@{/static/infor/images/shangpinxiangqing/X18.png}"></a></div>
			</ol>
		</ul>
	</div>
     <script >
		function  cart() {
			//获得商品的id号
			var id=$("#gid").val();
			//获得商品的数量
			var num=$("#num").val();
			//通过js跳转到控制层 control 添加购物车的control
			window.location.href="http://localhost:9000/SpringbootDemo/user/cart?gid="+id+"&num="+num;
		}

	 </script>

</body>
</html>
